<template>
	<view>
		<u-navbar title="报告单详情" bgColor="#4a62e7" titleStyle="color:#fff" placeholder autoBack leftIconColor="#fff"></u-navbar>
		<!-- <movable-area scale-area style="calc(100vh - 50px); width: 100%">
			<movable-view
				direction="all"
				out-of-bounds
				:scale="true"
				scale-min="1"
				scale-max="10"
				scroll-value="10"
				style="height: 100%; width: 100%"
			>
				<view
					style="
						width: 100%;
						height: 100%;
						transform: scale(0.41);
						transform-origin: 10% 0%;
						font-size: 80px;
					"
				>
					<web-view style="margin-top: 44px;width: 100%;height: calc(100vh - 50px);" :src="pageUrl" ref="reportDom" id="reportId"></web-view>
				</view>
			</movable-view>
		</movable-area> -->
		<!-- <image :src="imageUrl" mode="" style="width: 100%;height: calc(100vh - 50px);z-index: 99;"></image> -->
		<web-view :webview-styles="{scalable:true}" style="margin-top: 44px;height: calc(100vh - 50px);" :src="pageUrl" ref="reportDom" id="reportId" :fullscreen='true'></web-view>

	</view>
</template>

<script>
	import html2canvas from "html2canvas"
	export default {
		data() {
			return {
				imageUrl: '',
				// pageUrl: 'http://172.0.0.12:8081/vepts/admin/itemdata/changchunApp/item/5201112519110500029/2',
				pageUrl: '/static/index.html',
				// pageUrl: ''
			}
		},
		onLoad(param) {
			console.log(param);
			if(param.pageUrl){
				this.pageUrl = param.pageUrl;
			}
			
			
		},
		methods: {
			'试验不成功'(){
				setTimeout(()=>{
					//设置嵌入webview可以缩放
					// let dom = window.document.getElementsByTagName("body")[0]
					// if(!dom){
					// 		dom = window.document
					// }
						 
					// let iframe = dom.getElementsByTagName("iframe")
					// iframe = iframe[iframe.length - 1]
					// console.log(iframe);
					// try {
					// 	if (iframe) {
					// 		iframe = iframe.contentWindow
					// 		console.log(iframe.document);
					// 		console.log(iframe.document.html);
					// 		if (iframe.document && iframe.document.location && iframe.document.location.href){
					// 				//获得ifram当前地址，至于监听，赋值给data对象使用watch监听就可以了
					// 				console.log(iframe.document.location.href)
					// 		}
					// 	}
					// }catch (e) {
					// 	//TODO handle the exception
					// }
					// iframe.setStyle({scalable:true });//添加样式启动缩放
					// //向目标地址网页嵌入一段缩放设置标签;默认为0.1;最小值0.1;最大值0.99
					// console.log(iframe);
					// iframe.evalJS(`
					// 	var metaEl=document.createElement('meta')
					// 	metaEl.setAttribute('name','viewport')
					// 	metaEl.setAttribute('content','width=device=width, initial-scale=0.1,minimum-scale=0.1,maximum-scale=8.99')
					// 	document.head.appendchild(metaEl)
					// `)
				},1000)//如果是页面初始化调用时，需要延时一下
				setTimeout(()=>{
					html2canvas(document.getElementById('reportId')).then(canvas => {
						// 转成图片，生成图片地址
						//将canvas通过toDataURL转成图片url
						this.imageUrl = canvas.toDataURL("image/png");
						// console.log(this.imageUrl);
					}).catch((e) => {console.log(e)})
				},500)
			}
		}
	}
</script>

<style>

</style>
